// 发版设置
<template>
  <div class="releaseSet">
    <div class="top">
      <el-button type="primary" size="mini" @click="handleAdd(1)">添加</el-button>
    </div>
    <template>
      <el-table
        :data="listData"
        border
        style="width: 1500px">
        <el-table-column
          align="center"
          fixed
          label="序号"
          type="index"
          width="80">
        </el-table-column>
        <el-table-column
          align="center"
          prop="type"
          label="类型"
          width="150">
          <template slot-scope="scope">
            <span v-show="scope.row.type == 0">购房者端</span>
            <span v-show="scope.row.type == 2">经纪人端</span>
            <span v-show="scope.row.type == 1">管家端</span>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="version"
          label="版本号"
          width="150">
        </el-table-column>
        <el-table-column
          align="center"
          prop="open"
          label="是否屏蔽"
          width="120">
          <template slot-scope="scope">
            <span v-show="scope.row.open == 1">屏蔽</span>
            <span v-show="scope.row.open == 0">不屏蔽</span>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="content"
          label="屏蔽说明"
          width="300">
        </el-table-column>
        <el-table-column
          align="center"
          :formatter="timeFormatter"
          label="操作时间"
          width="180">
        </el-table-column>
        <el-table-column
          align="center"
          prop="createPeople"
          label="操作人"
          width="120">
        </el-table-column>
        <el-table-column
          align="center"
          label="操作">
          <template slot-scope="scope">
            <el-button type="text" size="mini" @click="handleAdd(2,scope.row)">编辑</el-button>
          </template>
        </el-table-column>
      </el-table>
    </template>
    <el-pagination
      style="margin-top:20px"
      background
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page.sync="pageData.pageNum"
      :page-sizes="[10, 20, 30, 40]"
      :page-size="pageData.pageSize"
      layout="total, sizes, prev, pager, next"
      :total="total">
    </el-pagination>
    
    <el-dialog
      :title="val == 1?'添加APP':'编辑'"
      :visible.sync="dialogVisible"
      width="500px"
      :before-close="handleClose">
      <el-form :inline="true" class="demo-form-inline" label-width="100px" label-position="left">
        <el-form-item label="类型：" >
          <el-select v-model="addForm.type" placeholder="" size="mini" :disabled="val == 2?true:false">
            <el-option :label="item.type" :value="item.val" v-for="(item,idx) in typeList" :key="idx"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="版本号：">
          <el-input v-model="addForm.version" placeholder=""  size="mini"></el-input>
        </el-form-item>
        <el-form-item label="是否屏蔽：">
          <el-radio-group v-model="addForm.open">
            <el-radio label="1">是</el-radio>
            <el-radio label="0">否</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="屏蔽说明：">
          <textarea id="" cols="40" rows="5" v-model="addForm.content"></textarea>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer" style="text-align: left">
        <el-button type="primary" @click="handleSave">保存</el-button>
        <el-button type="primary" @click="handleCancle">取消</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import api from "@/api/apiPath"
import util from '@/common/utils'
export default {
  name:"releaseSet",
  title:'发版屏蔽设置',
  components: {},
  data() {
    return {
      dialogVisible:false,
      listData:[],
      total:0,
      pageData:{
        pageSize:10,
        pageNum:1
      },
      addForm:{
        type:'',
        version:'',
        open:'',
        content:'',
      },
      typeList:[
        {val:0,type:'购房者端'},
        {val:1,type:'管家端'},
        {val:2,type:'经纪人端'},
      ],
      row:undefined,
      val:undefined
    }
  },
  mounted() {},
  created() {
    this.getListData()
  },
  activated(){
    this.getListData()
  },
  methods: {
    timeFormatter(row){
      return util.getTimeString(row.updateTime)
    },
    // 添加
    handleAdd(val,row){
      this.dialogVisible = true
      this.val = val
      this.row = row
      if(val == 2){
        this.addForm.type = row.type
        this.addForm.version = row.version
        this.addForm.open = String(row.open)
        this.addForm.content = row.content
      }
    },
    // 保存
    handleSave(){
      // 类型
      if(this.addForm.type != '0' && this.addForm.type != '1' && this.addForm.type != '2'){
        this.$message({
          type:'warning',
          message:'请选择类型'
        })
        return
      }
      // 版本号
      if(!this.addForm.version){
        this.$message({
          type:'warning',
          message:'请填写版本号'
        })
        return
      }
      // 是否屏蔽
      if(this.addForm.open !='0' && this.addForm.open !='1'){
        this.$message({
          type:'warning',
          message:'请选择是否屏蔽'
        })
        return
      }
      // 屏蔽说明
      if(!this.addForm.content){
        this.$message({
          type:'warning',
          message:'请填写屏蔽说明'
        })
        return
      }
      // 添加
      if(this.val == 1){
        this.$axios.post('/city/shield/save',{
          content:this.addForm.content,  // 屏蔽说明
          open:this.addForm.open,  // 是否屏蔽
          type:this.addForm.type, // 类型
          version:this.addForm.version, // 版本号
          createPeople:JSON.parse(window.sessionStorage.getItem('cmsUser')).name
        }).then(res=>{
          this.$message({
            type:'success',
            message:'添加成功'
          })
          this.getListData()
          this.dialogVisible = false
          this.clearData()
        })
      }else if(this.val == 2){
        console.log('编辑');
        
        this.$axios.post('/city/shield/update',{
          content:this.addForm.content,  // 屏蔽说明
          open:this.addForm.open,  // 是否屏蔽
          type:this.row.type, // 类型
          version:this.addForm.version, // 版本号
          createPeople:this.row.createPeople, // 创建人
          createTime:this.row.createTime, // 创建时间
          id:this.row.id, // 
          updateTime:Date.parse(new Date), // 更新时间
          updatePeople:JSON.parse(window.sessionStorage.getItem('cmsUser')).name, // 更新人
        }).then(res=>{
          console.log(res)
          this.$message({
            type:'success',
            message:'编辑成功'
          })
          this.getListData()
          this.dialogVisible = false
          this.clearData()
        })
      }
      
    },
    clearData(){
      this.addForm = {
        content:'',
        open:'',
        type:'',
        version:''
      }
    },
    // 取消
    handleCancle(){
      this.dialogVisible = false
      this.clearData()
    },
    // 获取列表数据
    getListData(){
      this.$axios.post('/city/shield/list',{
        pageSize:this.pageData.pageSize,
        pageNum:this.pageData.pageNum,
      }).then(res=>{
        console.log(res)
        this.listData = res.list
        this.total = res.total
      })
    },
    handleSizeChange(val) {
      this.pageData.pageSize = val
      this.getListData()
    },
    handleCurrentChange(val) {
      this.getListData()
    },
    handleClose(done) {
      this.$confirm('确认关闭？')
        .then(_ => {
          done();
        })
        .catch(_ => {});
    },
  },
  computed: {}
}
</script>
<style lang="stylus" scoped>
  .releaseSet {
    .top{
      margin-bottom :30px;
    }
  }
</style>